<!DOCTYPE html>
<html>
<head>
  <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <link href="../css/froala_editor.min.css" rel="stylesheet" type="text/css">


  <style>
    body {
      text-align: center;
    }

    section {
      width: 80%;
      margin: auto;
      text-align: left;
    }
  </style>
</head>

<body>
<section id="editor">
  <div id='edit' style="margin-top: 30px;">
    <table width="100%">
      <tr>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td rowspan="2"><br/></td>
        <td><br/></td>
      </tr>
      <tr>
        <td><br/></td>
        <td colspan="2"><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
      </tr>
      <tr>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td colspan="2"><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
        <td><br/></td>
      </tr>
  </div>
</section>

<script src="../js/libs/jquery-1.11.1.min.js"></script>
<script src="../js/froala_editor.min.js"></script>
<!--[if lt IE 9]>
<script src="../js/froala_editor_ie8.min.js"></script>
<![endif]-->
<script src="../js/plugins/tables.min.js"></script>
<script src="../js/plugins/lists.min.js"></script>
<script src="../js/plugins/colors.min.js"></script>
<script src="../js/plugins/media_manager.min.js"></script>
<script src="../js/plugins/font_family.min.js"></script>
<script src="../js/plugins/font_size.min.js"></script>
<script src="../js/plugins/block_styles.min.js"></script>
<script src="../js/plugins/video.min.js"></script>

<script>
  $(function () {
    $('#edit').editable({inlineMode: false})
  });
</script>
</body>
</html>
